<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <link rel="shortcut icon" href="favicon.ico" />
    	<link href="../../css/bootstrap.min14ed.css" rel="stylesheet" /> 
    <link href="../../css/font-awesome.min93e3.css" rel="stylesheet" />
    <link href="../../css/animate.min.css" rel="stylesheet" />
    <link href="../../css/style.min862f.css" rel="stylesheet" />
    <link rel="stylesheet" href="../../css/custom.css" />
</head>
<body>
	<div class="wrapper animated fadeInRight">
		<div class="top-tool row">
			<form action="" class="form-inline"  style="padding-top: 4px;">
				<div class="form-group">
					<label>用户名称:</label>
					<div class="input-group">
						<input type="text" name="" id="users" class="form-control input-sm" />
						<div class="input-group-btn">
                            <button type="button" class="btn btn-white btn-sm dropdown-toggle" data-toggle="dropdown">
                                <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu dropdown-menu-right" role="menu">
                            </ul>
                        </div>
					</div>
				</div>
				<div class="form-group">
					<label>用户员话:</label>
					<input type="text" name="" class="form-control input-sm" id="" />
				</div>
				<div class="form-group">
					<div class="form-group">
					<button type="submit" class="btn btn-primary btn-sm">搜索</button>
					<button type="button" class="btn btn-warning btn-sm" onclick="location.href=location.origin + location.pathname">清空搜索</button>
				</div>
				</div>
			</form>
		</div>
		<div class="row">
			<div class="col-xs-12 col-sm-6">
				<table class="table table-hover table-striped user-list">
					<thead>
						<tr>
							<th>姓名</th>
							<th>电话</th>
							<th>区域</th>
							<th>职业</th>
						</tr>
					</thead>
					<tbody>
						<tr data-uid="1">
							<td>唐老板</td>
							<td>136****2411</td>
							<td>广东省深圳</td>
							<td>导演</td>
						</tr>
						<tr data-uid="2">
							<td>唐老板</td>
							<td>136****2411</td>
							<td>广东省深圳</td>
							<td>导演</td>
						</tr>
						<tr data-uid="3">
							<td>唐老板</td>
							<td>136****2411</td>
							<td>广东省深圳</td>
							<td>导演</td>
						</tr>
						<tr data-uid="4">
							<td>唐老板</td>
							<td>136****2411</td>
							<td>广东省深圳</td>
							<td>导演</td>
						</tr>
					</tbody>
				</table>
			</div>
			<div class="col-xs-12 col-sm-6">
				<div class="text-center " id="normal" style="padding:50px 0">
					<h3 >请从左侧选择用户</h3>
				</div>
				<div id="adsList" style="display: none;">
					<form action="createOrder_over.html" >
						<table class="table table-hover table-striped">
							<thead>
								<tr>
									<th>&nbsp;</th>
									<th>收货人</th>
									<th>电话</th>
									<th>地址</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody>
								<tr data-aid="213">
									<td><input type="radio" name="address" value="1" /></td>
									<td>唐老板</td>
									<td>136****2411</td>
									<td>广东省深圳市宝安区XXXX街</td>
									<td>
										<a type="button" class="btn btn-primary btn-sm" data-toggle="modal" href="address.html?aid=213" data-target="#myModal">编辑</a>
									</td>
								</tr>
							</tbody>
						</table>
						<div style="padding:50px 0; " class="text-center">
							<a type="button" class="btn btn-warning" data-toggle="modal" href="address.html" data-target="#myModal">添加地址</a>
							<button type="submit" class="btn btn-primary">下一步</button>
						</div>
					</form>
				</div>
			</div>
			
		</div>
		
	</div>
<div class="modal inmodal" id="myModal" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content animated fadeInDown">
        </div>
    </div>	
</div>
<script src="../../js/jquery.min.js"></script>
<script src="../../js/bootstrap.min.js"></script>
<script src="../../js/content.min.js"></script>
<!--搜索提示-->
<script src="../../js/plugins/suggest/bootstrap-suggest.min.js"></script>
<!--自定义-->
<script src="../../js/config.js"></script>
<script type="text/javascript">
	var testBsSuggest=$("#users").bsSuggest({
        url:"../../data.json",
        idField:"userId",
        keyField:"userName"
    })
    .on("onDataRequestSuccess",function(e,result){
    })
    .on("onSetSelectValue",function(e,keyword){
    })
    .on("onUnsetSelectValue",function(e){
    });
    
    function emptyadd(){
    		$('#normal').show();
    		$('#adsList').hide();
    }
   //选择用户
   $('.user-list tbody tr').click(function(){
   		if( $(this).hasClass('active') ){
   			$(this).removeClass('active');
   			emptyadd();
   			return ;
   		}
   		$('.user-list tbody tr').removeClass('active');
   		$(this).addClass('active');
		//ajax  获取用户地址
		var uid = $(this).data('id');
		$('#normal').hide();
    		$('#adsList').show();
		//$.ajax
		
   });
</script>
</body>
</html>
